﻿@*自动计算 ---根据表单设计生成 PC端编辑页面 - 列表新增数据或编辑按钮打开此页面*@
@*YoursLC有源低代码 Create:admin 2024-04-01 10:39:20 添加或编辑-此文件放置于Views/AutomaticCalculation /中*@

@using Think9.Models;
@{ ViewBag.Title = "Form";
	Layout = "~/Areas/Shared/_LayuiForm.cshtml"; }
<style>
	/* 防止table的下拉列表被隐藏*/
	.layui-table-cell {
		overflow: visible;
	}
	.layui-table-box {
		overflow: visible;
	}
	.layui-table-body {
		overflow: visible; /* 与移动端冲突 */
	}
	/* 设置下拉框的高度与表格单元相同 */
	td .layui-form-select {
		margin-top: -3px;
		margin-left: -7px;
		margin-right: -7px;
	}
	.layui-table-view .layui-table th {
		overflow: hidden;
	}
</style>
<form class="layui-form layui-form-pane" lay-filter="formUser">
<input style="display:none" id="_isDebug" value="debug">@*debug为调试；release为发布*@
<input style="display:none" id="_isMobile" value="n">@*y为移动端*@
<input style="display:none" id="_disableStr" value="@ViewBag.DisableStr">@*禁用的控件字符，格式[controlid1]*@
<input style="display:none" id="_listid" value="@ViewBag.ListId">@*数据主键，添加时为0*@
<input style="display:none" id="_plit" value="@ViewBag.Split">@*多选框字符分割*@
<input style="display:none" id="_frm" value="@ViewBag.Frm">@*从哪里跳转来的?默认list*@
<input style="display:none" id="_type" value="@ViewBag.Type">@*add或edit*@
<input style="display:none" id="_userid" value="@ViewBag.UserId">@*用户id*@
<input style="display:none" id="_attachmentId">@*附件id*@
<input style="display:none" id="_fwid" value="@ViewBag.FId">@*当前流程编码*@
<input style="display:none" id="prc_id" value="@ViewBag.PrcId">@*当前流程步骤id*@
<input style="display:none" id="prc_no" value="@ViewBag.PrcNo">@*当前流程步骤编码*@
@*弹出选择时页面间传递数据*@
<input style="display:none" id="pu_value">@*弹出选择时使用-弹出页面选择的值*@
<input style="display:none" id="pu_tbid">@*弹出选择时使用-触发弹出页面的表id，_main或子表编码*@
<input style="display:none" id="pu_indexid">@*弹出选择时使用-触发弹出页面的指标编码(子表弹出时为子表编码+指标编码)*@
<input style="display:none" id="pu_rowid">@*弹出选择时使用-子表弹出，对应tableid 哪一行*@
<input style="display:none" id="pu_column">@*弹出选择时使用-子表弹出，第几列*@
<div class="layui-form">
 <div class="layui-form-item"  style="text-align: right;">
	<div class="layui-btn-container">
			@*<a href="" target="_blank" id="print" class="layui-btn">打印</a>*@
			<button type="button" class="layui-btn" id="att">附件</button>
			<button type="button" class="layui-btn" lay-submit lay-filter="edit" id="edit">保存</button>
			@*<button type="button" class="layui-btn" lay-submit lay-filter="next"  id="next">转交</button>*@
			<button type="button" class="layui-btn" lay-submit lay-filter="finish" id="finish">提交</button>
	 </div>
  </div>

<div class="layui-form-item">
	<div class="layui-col-md4">
		<div class="layui-form-item">
			<label class="layui-form-label"  style="width:110px;">A</label>
			<div class="layui-input-block"  style="margin-left:110px;">
				<input type='text' name='inXS01' id='inXS01' autocomplete='off' class='layui-input'  maxlength='15'    lay-verify='number'  placeholder='请输入小数01'  >
			</div>
		</div>
	</div>
	<div class="layui-col-md4">
		<div class="layui-form-item">
			<label class="layui-form-label"  style="width:110px;">B</label>
			<div class="layui-input-block"  style="margin-left:110px;">
				<input type='text' name='inXS02' id='inXS02' autocomplete='off' class='layui-input'  maxlength='15'    lay-verify='number'  placeholder='请输入小数02'  >
			</div>
		</div>
	</div>
	<div class="layui-col-md4">
		<div class="layui-form-item">
			<label class="layui-form-label"  style="width:110px;">C</label>
			<div class="layui-input-block"  style="margin-left:110px;">
				<input type='text' name='inXS03' id='inXS03' autocomplete='off' class='layui-input'  maxlength='15'    lay-verify='number'  placeholder='请输入小数03'  >
			</div>
		</div>
	</div>
</div>
<div class="layui-form-item">
	<div class="layui-col-md4">
		<div class="layui-form-item">
			<label class="layui-form-label"  style="width:110px;">小数04</label>
			<div class="layui-input-block"  style="margin-left:110px;">
				<input type='text' name='inXS04' id='inXS04' autocomplete='off' class='layui-input layui-disabled'  maxlength='15'   disabled='disabled'   lay-verify='number'  placeholder='A+B+C'  >
			</div>
		</div>
	</div>
	<div class="layui-col-md4">
		<div class="layui-form-item">
			<label class="layui-form-label"  style="width:110px;">小数05</label>
			<div class="layui-input-block"  style="margin-left:110px;">
				<input type='text' name='inXS05' id='inXS05' autocomplete='off' class='layui-input layui-disabled'  maxlength='15'   disabled='disabled'   lay-verify='number'  placeholder='A*B除C'  >
			</div>
		</div>
	</div>
	<div class="layui-col-md4">
		<div class="layui-form-item">
			<label class="layui-form-label"  style="width:110px;">小数06</label>
			<div class="layui-input-block"  style="margin-left:110px;">
				<input type='text' name='inXS06' id='inXS06' autocomplete='off' class='layui-input layui-disabled'  maxlength='15'   disabled='disabled'   lay-verify='number'  placeholder='A+B*C'  >
			</div>
		</div>
	</div>
</div>
<div class="layui-form-item">
	<div class="layui-col-md4">
		<div class="layui-form-item">
			<label class="layui-form-label"  style="width:110px;">小数07</label>
			<div class="layui-input-block"  style="margin-left:110px;">
				<input type='text' name='inXS07' id='inXS07' autocomplete='off' class='layui-input'  maxlength='15'    lay-verify='number'  placeholder='子表列1合计'  >
			</div>
		</div>
	</div>
	<div class="layui-col-md4">
		<div class="layui-form-item">
			<label class="layui-form-label"  style="width:110px;">小数08</label>
			<div class="layui-input-block"  style="margin-left:110px;">
				<input type='text' name='inXS08' id='inXS08' autocomplete='off' class='layui-input'  maxlength='15'    lay-verify='number'  placeholder='子表列3合计'  >
			</div>
		</div>
	</div>
	<div class="layui-col-md4">
	</div>
</div>
<div class="layui-table-box" id="div_tb_Subtable05">
	<table class="layui-hide" id="tb_Subtable05" lay-filter="tableFilter"> </table></div>
		<span class='layui-word-aux'>双击打开编辑页面<i class='fa fa-angle-double-up'></i></span>
</div>


</form>
<script>
	layui.config({
		base: '/Self_JS/'  /*自定义的js--wwwroot\Self_JS\AutomaticCalculation.js*/
	});
	layui.use(["form", "exLayer", "element", "exUtils",  "table", "AutomaticCalculation"], function () {
		let form = layui.form;
		let layer = layui.layer;
		let table = layui.table;
		let exLayer = layui.exLayer;
		let exUtils = layui.exUtils;
		let element = layui.element;
		let myJS = layui.AutomaticCalculation;
		let $ = layui.$;

		form.render();//更新全部表单数据
		getFormVal();//控件赋值-复选框和图片

		//Tab选项
		element.on('tab(element_Filter)', function (data) {
        });
		//赋值--不包括多选框和图片
		form.val("formUser", {
			"inXS01": "@Model.inXS01"
			,"inXS02": "@Model.inXS02"
			,"inXS03": "@Model.inXS03"
			,"inXS04": "@Model.inXS04"
			,"inXS05": "@Model.inXS05"
			,"inXS06": "@Model.inXS06"
			,"inXS07": "@Model.inXS07"
			,"inXS08": "@Model.inXS08"
		});
		//自定义控件赋值，用于多选框和图片的显示
		function getFormVal() {


		}




		//附件上传
		$('#att').on('click', function () {
			exLayer.open('附件上传', '/Com/FileManage/Attachment?fwid=' + $('#_fwid').val() + '&listid=' + $('#_listid').val() + '&prcid=' + $('#prc_id').val() + '&userid=' + $('#_userid').val() + '&attid=' + $('#_attachmentId').val(), '100%', '100%', '0px', '0px', null, null);
		});
		//点击保存按钮 发布模式调用_TB/SaveData，调试模式调用AutomaticCalculation/SaveData
		form.on("submit(edit)", function (data) {
			var _gridList = myJS.foreachGridTable();//遍历子表取数，在自定义js中定义
			exUtils.ajax('/_TB/SaveData', 'post', {
				model: data.field, 'gridlist': _gridList, listid: $('#_listid').val(), prcno: $('#prc_no').val(), type: $('#_type').val(), att: $('#_attachmentId').val(), fwid: $('#_fwid').val(), json: JSON.stringify(data.field, null, 4) }, true).done(function (response) {
				exLayer.greenTickMsg(response.message, function () {
				if ($('#_frm').val() == 'list') {
					//从List页面跳转需刷新列表
					$(window.parent.document).find('#search').click();
				}
				parent.layer.close(parent.layer.getFrameIndex(window.name));
			});
		}).fail(function (error) {
			console.log(error);
		});
			return false;
		});
		//点击结束|提交按钮 发布模式调用_TB/Finish，调试模式调用AutomaticCalculation/Finish
		form.on("submit(finish)", function (data) {
			exLayer.confirm('数据将被锁定，您确定继续吗?', function () {
				var _gridList = myJS.foreachGridTable();//遍历子表取数，在自定义js中定义
				exUtils.ajax('/_TB/Finish', 'post', {
					model: data.field, 'gridlist': _gridList, listid: $('#_listid').val(), prcno: $('#prc_no').val(), type: $('#_type').val(), att: $('#_attachmentId').val(), fwid: $('#_fwid').val(), json: JSON.stringify(data.field, null, 4) }, true).done(function (response) {
					exLayer.greenTickMsg(response.message, function () {
					if ($('#_frm').val() == 'list') {
						//从List页面跳转需刷新列表
						$(window.parent.document).find('#search').click();
					}
					parent.layer.close(parent.layer.getFrameIndex(window.name));
				});
			}).fail(function (error) {
				console.log(error);
			});
			return false;
			})
		});

			
		//渲染表格，url数据接口参数；cols设置显示字段...
		let tb_Subtable05 = table.render({
			elem: "#tb_Subtable05",
			url: "/_TB/GetGridList?tbid=tb_Subtable05"+"&listid=" + $('#_listid').val() + "&from=" + $('#_type').val() + "&fwid=" + $('#_fwid').val()+ "&mobile=" + $('#_isMobile').val(),
			page: false,
			cols: [[
					@*flag与Vn(n为大于等于1的整数)之间不能手动插入或删除列，不能更改次序，否则会有错误*@
				{ field: "flag",  hide: true }
				,{type: "numbers", title: "NO." }
				,{ field: "v1", title: "列1", width: 180, templet: '#tb_Subtable05v1' }
				,{ field: "v2", title: "列2", width: 180, templet: '#tb_Subtable05v2' }
				,{ field: "v3", title: "列3", width: 180, templet: '#tb_Subtable05v3' }
				,{ title: "<button type='button' class='layui-btn layui-btn-primary layui-btn-xs' id='refresh_tb_Subtable05'><i class='fa  fa-refresh'></i></button>", align: "left", templet: "#addordelitem" }
			]],
			done: function (res, curr, count) {
				//移动端设定div宽度，否则表头显示不全
				if ($(window).width() < 768) {
					$('#div_tb_Subtable05').css({ 'width': '670'});
				}
				$('.layui-table .layui-table-cell > span').css({ 'font-weight': 'bold' });
				$('#refresh_tb_Subtable05').click(function () {
					tableRender('tb_Subtable05');//子表数据刷新
				});
				if (count == -1) {
					layer.msg(res.msg, { icon: 5, time: 20000, btn: ['关闭'] });//显示错误
				}
				
			}
		
		});
       //tool监听事件(处理table数据行按钮)
	   table.on("tool(tableFilter)", function (obj) {
		let data = obj.data;
		switch (obj.event) {
			case "addGrid":
				addGrid(data);
				break;
			case "delGrid":
				delGrid(data);
				break;
		 }
		});

		//子表添加一条数据，点击右侧添加按钮调用，发布模式调用_TB/AddGrid，调试模式调用AutomaticCalculation/AddGrid
		function addGrid(data) {
			var _controlsList = myJS.getControlValueList();//主表所有控件
            var _gridList = myJS.getFirstGridTable();//只取子表数据首行
			exUtils.ajax("/_TB/AddGrid", "post", { model: data.field, "list": _gridList, tbid: data.TbId, listid: $('#_listid').val(), fwid: $("#_fwid").val(), controlslist: _controlsList }, true).done(function (response) {
				$("#_listid").val(response.extra);//listid为零时，添加子表数据需首先主表添加数据，再为前端控件赋值
				tableRender(data.TbId);//子表数据刷新
			}).fail(function (error) {
				console.log(error);
			});
		}

		//子表删除一条数据，点击右侧删除按钮调用，发布模式调用_TB/DelGrid，调试模式调用AutomaticCalculation/DelGrid
		function delGrid(data) {
		    var _controlsList = myJS.getControlValueList();//主表所有控件
			exLayer.confirm("确定要删除吗？", function () {
				exUtils.ajax("/_TB/DelGrid", "post", { flag: data.flag, listid: data.ListId, fwid: $("#_fwid").val(), controlslist: _controlsList }, true).done(function (response) {
					tableRender(data.TbId);//子表数据刷新
					exUtils.tableSuccessMsg('删除成功！');
				}).fail(function (error) {
					console.log(error);
				});
			})
		}

		//子表刷新 发布模式调用_TB/GetGridList，调试模式调用AutomaticCalculation/GetGridList
		function tableRender(tbid) {
			if (tbid == 'tb_Subtable05' || tbid.indexOf('#tb_Subtable05#') > -1) {
				tb_Subtable05.reload({
					url: "/_TB/GetGridList?tbid=tb_Subtable05" + "&listid=" + $('#_listid').val() + "&from=" + $('#_type').val() + "&fwid=" + $('#_fwid').val()+ "&mobile=" + $('#_isMobile').val()
				});
			}
		}
        //toolbar监听事件(处理table顶部按钮)
        table.on("toolbar(tableFilter)", function (obj) {
            switch (obj.event) {

            }
        });
		//监听事件 触发子表行双击事件 打开编辑页面
		table.on('rowDouble(tableFilter)', function (obj) {
			if (obj.data.Id != -1) {
				if (obj.data.Id == 0) {
					exLayer.openMiddle('新增数据', '/_TB/GridForm?type=add&grid=' + obj.data.TbId + '&listid=' + $('#_listid').val() + '&fwid=' + $('#_fwid').val() + '&prcno=' + $('#prc_no').val(), '500px', '450px', layui.device().mobile);
				}
				else {
					exLayer.openMiddle('编辑数据', '/_TB/GridForm?type=edit&listid=' + $('#_listid').val() + '&fwid=' + $('#_fwid').val() + '&prcno=' + $('#prc_no').val() + '&flag=' + replaceAll(obj.data.flag, '#', '!'), '500px', '450px', layui.device().mobile);
				}
			}
		});
		//很重要 弹出页面关闭后为控件赋值并执行数据读取，在弹出的子页面中被调用
		$("#pu_value").click(function () {
		   //弹出页面关闭后，选择的Value为触发弹出页面的input赋值，wwwroot\Self_JS\AutomaticCalculation.js中定义
			myJS.getValueFromPopUp();
			readValue();//执行数据读取，每个弹出选择都调用，如果没有设置数据读取后台返回空，前端也不会执行控件赋值
		});
		//数据读取，后端返回lists，再调用myJS.setValueByList(lists)完成为控件赋值
		function readValue() {
		    //子表取当前行数据，wwwroot\Self_JS\AutomaticCalculation.js中定义
			var _gridList = myJS.getCurrentGridTable($('#pu_tbid').val(), $('#pu_rowid').val());
			//读取主表所有控件ID和Value，wwwroot\Self_JS\AutomaticCalculation.js中定义
            var _controlsList = myJS.getControlValueList();
			//后台取数据，发布模式调用_TB/AfterControlSelect，调试模式调用AutomaticCalculation/AfterControlSelect
			exUtils.ajax("/_TB/AfterControlSelect", "post", { controlslist: _controlsList, "gridlist": _gridList, id: $('#pu_rowid').val(), tbid: $('#pu_tbid').val(), indexid: $('#pu_indexid').val(), value: $('#pu_value').val(), fwid: $('#_fwid').val(), listid: $('#_listid').val() }, true).done(function (response) {
				var lists = response.list;//后台返回的数据
				var _listid = response.extra;
                var _grid = response.extra2;
				if (_listid != "") {
                    $('#_listid').val(_listid);
                }
                if (lists != null) {
				    //使用后台返回的lists，为控件赋值，wwwroot\Self_JS\AutomaticCalculation.js中定义
                    myJS.setValueByList(lists);
				}
				if (_grid != "") {
                    tableRender(_grid);//子表数据刷新
				}

				form.render();//更新表单数据，一定要加
			}).fail(function (error) {
				console.log(error);
			});

			return false;
		}
		//打印 发布模式调用_TB/Print，调试模式调用AutomaticCalculation/Print
        function setPrint() {
            $("#print").attr("href", "/_TB/Print?listid=" + $('#_listid').val() + "&type=pdf&fwid=" + $('#_fwid').val());
        }

		//消息提示
        $(document).on("mouseenter", "*[lay-tips]", function () {
            var remind = $(this).attr("lay-tips");
            var tips = $(this).data("offset") || 4;
            var color = $(this).data("color") || '#88858e';
            layer.tips(remind, this, {
                time: -1,
                tips: [tips, color],
                area: ['auto', 'auto'],
            });
        }).on("mouseleave", "*[lay-tips]", function () {
            layer.closeAll("tips");
        });

		$(document).ready(function () {
		    setPrint();//打印

			myJS.disableFormBtn("@ViewBag.DisableBut");//控制页面按钮状态
		    myJS.disabledControlsByPrcNo($('#prc_no').val());//根据步骤编码设置控件disabled属性
			form.render('select');//要加上，否则下拉选择disabled设置无效

			if (layui.device().mobile) {
				$(".layui-btn").attr("class", "layui-btn layui-btn-sm");//移动端
            }
        });
	});
</script>
<!-- 添加或删除 排除了统计行 -->
<script type='text/html' id='addordelitem'>
    {{#  if(d.Id >= 0){ }}
    {{#  if(d.Id == 0){ }}
    <button type="button" class='layui-btn layui-btn-xs' title='添加数据' lay-event='addGrid' id='addGrid'><i class='fa fa-plus'></i></button>
    {{#  } else{ }}
    <button type="button" class='layui-btn layui-btn-danger layui-btn-xs' title='删除数据' lay-event='delGrid' id='delGrid'><i class='fa fa-minus'></i></button>
    {{#  } }}
    {{#  } }}
</script>
<!-- 列1 -->
<script type="text/html" id="tb_Subtable05v1">
	<input type='text' name='tb_Subtable05v1' value = '{{d.v1_Exa}}' autocomplete='off' class='layui-input'  maxlength='15' style='height:30px;'  placeholder='列1'  {{d.v1_Lock}}>
</script>
<!-- 列2 -->
<script type="text/html" id="tb_Subtable05v2">
	<input type='text' name='tb_Subtable05v2' value = '{{d.v2_Exa}}' autocomplete='off' class='layui-input'  maxlength='15' style='height:30px;'  placeholder='列2'  {{d.v2_Lock}}>
</script>
<!-- 列3 -->
<script type="text/html" id="tb_Subtable05v3">
	<input type='text' name='tb_Subtable05v3' value = '{{d.v3_Exa}}' autocomplete='off' class='layui-input'  maxlength='15' style='height:30px;'  placeholder='列1*列2'  {{d.v3_Lock}}>
</script>
<!-- 子表onclick调用 -->
<script>
	function PopUpPage(tbid, indexid, id) {
		var url = '/_TB/PopUpPage?';
		popSelectValue(tbid, indexid, id, url, document.getElementById("_fwid").value);
	}
	function PopUpImgUplaod(tbid, indexid, id, fname) {
		popImgUplaod2(tbid, indexid, id, fname);
	}
</script>